<html>
<head>
	<link type="text/css" rel="stylesheet" href="../css/default.css" />
    <link type="text/css" rel="stylesheet" href="../js/rainbow/themes/sunburst.css">
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
</head>
<body>
	<div class="page">
<h2>IgeViewport <span>CLASS</span></h2>
<p>Declared in <a href="../../engine/core/IgeViewport.js">IgeViewport.js</a></p>
<div class="itemBox">
	<div class="header">Description</div>
	<div class="content">Creates a new viewport.</div>
</div>
<!--=if{extends}[-->
<div class="itemBox">
	<div class="header">Extends</div>
	<div class="content"><a href="IgeEntity.html">IgeEntity</a></div>
</div>
<!--=if{extends}]-->
<h2>Methods</h2><a name="minimumVisibleArea"></a>
<h3 class="methodTitle">minimumVisibleArea</h3>
<div class="methodSection">
    <!--=if{desc}[-->
    <div class="methodDesc">Sets the minimum amount of world in pixels to display in width and height. When set, if the viewport's geometry is reduced below the minimum width or height, the viewport's camera is automatically scaled to ensure that the minimum area remains visible in the viewport.</div>
    <!--=if{desc}]-->
    <div class="methodDefinition"><span class="methodName">minimumVisibleArea</span>({<span class="argType">Integer</span>} <span class="argName">width</span>, {<span class="argType">Integer</span>} <span class="argName">height</span>)</div>
    <div class="methodArgs"><ul class="argList"><li>{<span class="argType">Integer</span>}<span class="argName">width</span> Width in pixels.</li><li>{<span class="argType">Integer</span>}<span class="argName">height</span> Height in pixels.</li></ul></div>
    <div class="methodReturnDesc">Returns {<span class="argType">*</span>} </div>
    
</div><a name="autoSize"></a>
<h3 class="methodTitle">autoSize</h3>
<div class="methodSection">
    <!--=if{desc}[-->
    <div class="methodDesc">Gets / sets the auto-size property. If set to true, the viewport will automatically resize to fill the entire scene.</div>
    <!--=if{desc}]-->
    <div class="methodDefinition"><span class="methodName">autoSize</span>({<span class="argType"></span>} <span class="argName">val</span>)</div>
    <div class="methodArgs"><ul class="argList"><li>{<span class="argType"></span>}<span class="argName">val</span> </li></ul></div>
    <div class="methodReturnDesc">Returns {<span class="argType">*</span>} </div>
    
</div><a name="scene"></a>
<h3 class="methodTitle">scene</h3>
<div class="methodSection">
    <!--=if{desc}[-->
    <div class="methodDesc">Gets / sets the scene that the viewport will render.</div>
    <!--=if{desc}]-->
    <div class="methodDefinition"><span class="methodName">scene</span>({<span class="argType"><a href="./IgeScene2d.html">IgeScene2d</a></span>} <span class="argName">scene</span>)</div>
    <div class="methodArgs"><ul class="argList"><li>{<span class="argType"><a href="./IgeScene2d.html">IgeScene2d</a></span>}<span class="argName">scene</span> </li></ul></div>
    <div class="methodReturnDesc">Returns {<span class="argType">*</span>} </div>
    
</div><a name="mousePos"></a>
<h3 class="methodTitle">mousePos</h3>
<div class="methodSection">
    <!--=if{desc}[-->
    <div class="methodDesc">Returns the viewport's mouse position.</div>
    <!--=if{desc}]-->
    <div class="methodDefinition"><span class="methodName">mousePos</span>()</div>
    <div class="methodArgs"></div>
    <div class="methodReturnDesc">Returns {<span class="argType">IgePoint</span>} </div>
    
</div><a name="viewArea"></a>
<h3 class="methodTitle">viewArea</h3>
<div class="methodSection">
    <!--=if{desc}[-->
    <div class="methodDesc">Gets the current rectangular area that the viewport is "looking at" in the world. The co-ordinates are in world space.</div>
    <!--=if{desc}]-->
    <div class="methodDefinition"><span class="methodName">viewArea</span>()</div>
    <div class="methodArgs"></div>
    <div class="methodReturnDesc">Returns {<span class="argType">IgeRect</span>} </div>
    
</div><a name="update"></a>
<h3 class="methodTitle">update</h3>
<div class="methodSection">
    <!--=if{desc}[-->
    <div class="methodDesc">Processes the updates before the render tick is called.</div>
    <!--=if{desc}]-->
    <div class="methodDefinition"><span class="methodName">update</span>({<span class="argType"></span>} <span class="argName">ctx</span>)</div>
    <div class="methodArgs"><ul class="argList"><li>{<span class="argType"></span>}<span class="argName">ctx</span> </li></ul></div>
    <div class="methodReturnDesc"></div>
    
</div><a name="tick"></a>
<h3 class="methodTitle">tick</h3>
<div class="methodSection">
    <!--=if{desc}[-->
    <div class="methodDesc">Processes the actions required each render frame.</div>
    <!--=if{desc}]-->
    <div class="methodDefinition"><span class="methodName">tick</span>()</div>
    <div class="methodArgs"></div>
    <div class="methodReturnDesc"></div>
    
</div><a name="screenPosition"></a>
<h3 class="methodTitle">screenPosition</h3>
<div class="methodSection">
    <!--=if{desc}[-->
    <div class="methodDesc">Returns the screen position of the viewport as an IgePoint where x is the "left" and y is the "top", useful for positioning HTML elements at the screen location of an IGE entity. The returned values indicate the center of the viewport on the screen.  This method assumes that the top-left of the main canvas element is at 0, 0. If not you can adjust the values yourself to allow for offset.</div>
    <!--=if{desc}]-->
    <div class="methodDefinition"><span class="methodName">screenPosition</span>()</div>
    <div class="methodArgs"></div>
    <div class="methodReturnDesc">Returns {<span class="argType">IgePoint</span>} The screen position of the entity.</div>
    
					<div class="methodExample">
						<div class="content"><h1>Get the screen position of the entity</h1>

<pre><code>var screenPos = entity.screenPosition();
</code></pre>
</div>
					</div>
				
</div><a name="paintAabbs"></a>
<h3 class="methodTitle">paintAabbs</h3>
<div class="methodSection">
    <!--=if{desc}[-->
    <div class="methodDesc">Draws the bounding data for each entity in the scenegraph.</div>
    <!--=if{desc}]-->
    <div class="methodDefinition"><span class="methodName">paintAabbs</span>({<span class="argType"></span>} <span class="argName">ctx</span>, {<span class="argType"></span>} <span class="argName">rootObject</span>, {<span class="argType"></span>} <span class="argName">index</span>)</div>
    <div class="methodArgs"><ul class="argList"><li>{<span class="argType"></span>}<span class="argName">ctx</span> </li><li>{<span class="argType"></span>}<span class="argName">rootObject</span> </li><li>{<span class="argType"></span>}<span class="argName">index</span> </li></ul></div>
    <div class="methodReturnDesc"></div>
    
</div><a name="_resizeEvent"></a>
<h3 class="methodTitle">_resizeEvent</h3>
<div class="methodSection">
    <!--=if{desc}[-->
    <div class="methodDesc">Handles screen resize events.</div>
    <!--=if{desc}]-->
    <div class="methodDefinition"><span class="methodName">_resizeEvent</span>({<span class="argType"></span>} <span class="argName">event</span>)</div>
    <div class="methodArgs"><ul class="argList"><li>{<span class="argType"></span>}<span class="argName">event</span> </li></ul></div>
    <div class="methodReturnDesc"></div>
    
</div><a name="_stringify"></a>
<h3 class="methodTitle">_stringify</h3>
<div class="methodSection">
    <!--=if{desc}[-->
    <div class="methodDesc">Returns a string containing a code fragment that when evaluated will reproduce this object's properties via chained commands. This method will only check for properties that are directly related to this class. Other properties are handled by their own class method.</div>
    <!--=if{desc}]-->
    <div class="methodDefinition"><span class="methodName">_stringify</span>()</div>
    <div class="methodArgs"></div>
    <div class="methodReturnDesc">Returns {<span class="argType">String</span>} </div>
    
</div>	</div>
    <script type="text/javascript">
        $(function () {
            $('code').attr('data-language', 'javascript');
        });
    </script>
    <script type="text/javascript" src="../js/rainbow/rainbow-custom.min.js"></script>
</body>
</html>